<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="Expires" content="0">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Cache-control" content="no-cache">
    <meta http-equiv="Cache" content="no-cache">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <link rel="stylesheet" href="../../css/style.css" />
    <link rel="stylesheet" href="../../css/element.css?v=1">
    <script src="../../js/zyrpublic.js?v=1.1"></script>
    <script src="../../js/zyrfunction.js?v=1.1"></script>

    <script src="../../javascript/vue.js"></script>
    <script src="../../javascript/elementui.js"></script>
    <script src="../../javascript/axios.min.js"></script>
    <script src="../../js/qs.js"></script>
</head>

<body>
    <div class="page-wrap" id="app">
        <section class="page-hd t">
            <header>
                <h5 class="title">
                    <a href="#" class="red">任务管理</a>
                </h5>
            </header>
            <hr />
        </section>
        <el-tabs type="border-card" @tab-click="handleClickTab">
            <el-tab-pane label="会员任务">
                <div style="font-size: 16px;">每日任务</div>
                <div style="margin-top: 20px; " v-for="(e ,i) in taskList" :key="i">
                    <el-checkbox v-model="e.taskEnable" @change="handlememberChange(e)">{{e.taskName}}</el-checkbox>
                    <div style="margin-top: 10px; margin-left: 20px;">
                        完成后可得 <input type="number"
                            style="height: 25px;width: 30px;  border: 1px solid #B8B8B8; text-align: center; margin-left: 3px;"
                            v-model="e.completeReward" onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" @blur="handlememberChange(e)" /> 经验
                    </div>

                </div>


            </el-tab-pane>
            <el-tab-pane label="积分任务">
                <div style="font-size: 16px;">一次性任务</div>
                <div style="margin-top: 20px;" v-for="(w,v) in onlylist" :key="v">
                    <el-checkbox v-model="w.taskEnable" @change="handleintegralChange(w)">{{w.taskName}}</el-checkbox>
                    <div style="margin-top: 10px; margin-left: 20px;">
                        完成可得积分<input type="number"
                            style="height: 25px;width: 30px;  border: 1px solid #B8B8B8; text-align: center; margin-left: 3px;"
                            v-model="w.completeReward" onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" @blur="handleintegralChange(w)" />
                    </div>
                </div>

                <div style="font-size: 16px; margin-top: 20px;">每日任务</div>

                <div
                    style="display: flex; flex-wrap: wrap; width: 300px; justify-content: space-between;  margin-top: 20px;">
                    <div v-for="(m,n) in everyDayList" :key="n" style=" margin-top: 20px">
                        <el-checkbox v-model="m.taskEnable" @change="handleintegralChange(m)">{{m.taskName}}</el-checkbox>
                        <div style="margin-top: 10px; margin-left: 20px;">
                            完成可得积分<input type="number"
                                style="height: 25px;width: 30px;  border: 1px solid #B8B8B8; text-align: center; margin-left: 3px;"
                                v-model="m.completeReward" onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" @blur="handleintegralChange(m)" />
                        </div>
                    </div>

                </div>
                <!-- <div style="display: flex; margin: 20px 0;">
                    <div>
                        <el-checkbox v-model="val1">参加秒杀</el-checkbox>
                        <div style="margin-top: 10px;">
                            完成可得积分<input type="text"
                                style="height: 25px;width: 30px;  border: 1px solid #B8B8B8; text-align: center; margin-left: 3px;"
                                v-model="inp1" />
                        </div>
                    </div>
                    <div style="margin-left: 50px;">
                        <div>
                            <el-checkbox v-model="val1">邀请好友注册</el-checkbox>
                            <div style="margin-top: 10px;">
                                完成可得积分<input type="text"
                                    style="height: 25px;width: 30px;  border: 1px solid #B8B8B8; text-align: center; margin-left: 3px;"
                                    v-model="inp1" />
                            </div>
                        </div>
                    </div>
                </div>
                <div style="display: flex; margin: 20px 0;">
                    <div>
                        <el-checkbox v-model="val1">参加拼单</el-checkbox>
                        <div style="margin-top: 10px;">
                            完成可得积分<input type="text"
                                style="height: 25px;width: 30px;  border: 1px solid #B8B8B8; text-align: center; margin-left: 3px;"
                                v-model="inp1" />
                        </div>
                    </div>
                    <div style="margin-left: 50px;">
                        <div>
                            <el-checkbox v-model="val1">订单评价</el-checkbox>
                            <div style="margin-top: 10px;">
                                完成可得积分<input type="text"
                                    style="height: 25px;width: 30px;  border: 1px solid #B8B8B8; text-align: center; margin-left: 3px;"
                                    v-model="inp1" />
                            </div>
                        </div>
                    </div>
                </div>
                <div>
                    <el-checkbox v-model="val1">茶言说分享</el-checkbox>
                    <div style="margin-top: 10px;">
                        完成可得积分<input type="text"
                            style="height: 25px;width: 30px;  border: 1px solid #B8B8B8; text-align: center; margin-left: 3px;"
                            v-model="inp1" />
                    </div>
                </div> -->

            </el-tab-pane>
            <el-tab-pane label="邀请额外积分任务">
                <div style="font-size: 16px;">邀请获得额外积分</div>
                <div style="display: flex; flex-wrap: wrap; width: 700px; justify-content: space-between;">
                    <div v-for="(e, i) in invitedIntegralList" :key="i" style="margin-top: 20px;">
                        <el-checkbox v-model="e.enable" @change="handleInvitedUpdate(e)"></el-checkbox> {{ i +
                        1}}.邀请<input type="number"
                            style="height: 25px;width: 50px;  border: 1px solid #8d7d7d; text-align: center; margin-left: 3px;"
                            v-model="e.userCount" onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" />人， 奖励<input type="number"
                            style="height: 25px;width: 50px;  border: 1px solid #B8B8B8; text-align: center; margin-left: 3px;"
                            v-model="e.rewardIntegral" onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" />积分
                            <el-button type="primary" style="margin-left: 15px;" size="mini" @click="handleInvitedUpdate(e)">确认修改</el-button>
                    </div>
                </div>

            </el-tab-pane>

        </el-tabs>


    </div>
    <!---page-wrap------>
</body>

<script>
    var instance = axios.create({
        baseURL: httpurl,
        timeout: 3000,
        headers: {
            'Content-Type': 'application/json',
            "Authorization": GetTokenInfo()
        }
    })
</script>

<script>

    var app = new Vue({
        el: "#app",
        data() {
            return {
                tabIndex: 1,
                val1: true,
                val2: true,
                inp1: '',
                inp2: '',
                taskList: [],
                copytaskList: [],
                copyintegralList:[],
                copyinvitedList:[],
                onlylist: [],
                everyDayList: [],
                invitedIntegralList: [],
                isChange: true
            };
        },

        mounted() {
            this.getqueryMemberTaskByType(this.tabIndex)

        },

        methods: {
            //
            handleClickTab(e) {

                let index = +e.index + 1
                this.tabIndex = index

                console.log(index);
                if (index == 3) {
                    this.getqueryMemberExtraInvitedIntegralList()
                    return
                }
                this.getqueryMemberTaskByType(index)


            },
            //
            updateTask(e){
                let tempData = {
                        completeReward: e.completeReward,
                        icon: e.icon,
                        id: e.id,
                        restrictionInterval: e.restrictionInterval,
                        restrictionNum: e.restrictionNum,
                        spendMoney: e.spendMoney,
                        taskEnable: e.taskEnable == true ? 1 : 0,
                        taskName: e.taskName,
                        taskType: e.taskType
                    }
                    instance.post(`updateMemberTaskById`, tempData)
                        .then(res => {
                            console.log(res);
                            if (res.data.rtnCode == 200) {
                                this.$message.success('修改成功')
                                this.getqueryMemberTaskByType(this.tabIndex)
                            }else{
                                this.$message.info(res.data.msg)
                            }
                        })
            },
            // 会员任务开启与关闭及经验值修改
            handlememberChange(e) {
                this.isChange = true
                console.log(e);
                console.log(this.copytaskList);
                this.copytaskList.forEach( v => {
                    if(v.id == e.id && v.completeReward == e.completeReward && v.taskEnable == e.taskEnable){
                        this.isChange = false
                    }
                })
            
              
                if(this.isChange){
                    this.updateTask(e)
                }
             
                  
            },
            // 积分任务修改
            handleintegralChange(e){
                 this.isChange = true 
                 this.copyintegralList.forEach( v => {
                     if(v.id == e.id && v.completeReward == e.completeReward && v.taskEnable == e.taskEnable){
                        this.isChange = false
                    }
                 })
                 if(this.isChange){
                       this.updateTask(e)
                 }
            },


            // 任务查询
            getqueryMemberTaskByType(id) {
                instance.get(`queryMemberTaskList?taskType=${id}`)
                    .then(res => {

                        if (res.data.rtnCode == 200) {
                            let list = res.data.data

                            console.log(list);
                            list = list.map(e => {
                                return {
                                    completeReward: e.completeReward,
                                    icon: e.icon,
                                    id: e.id,
                                    restrictionInterval: e.restrictionInterval,
                                    restrictionNum: e.restrictionNum,
                                    spendMoney: e.spendMoney,
                                    taskEnable: e.taskEnable == 1 ? true : false,
                                    taskName: e.taskName,
                                    taskType: e.taskType
                                }
                            })

                            if (id == 1) {
                                this.copytaskList = deepCopy(list)
                                this.taskList = list
                            } else if (id == 2) {
                                this.copyintegralList = deepCopy(list)
                                let onlylist = []
                                let everyDayList = []
                                list.forEach(e => {
                                    if (e.restrictionInterval == 1) {
                                        onlylist.push(e)
                                    } else if (e.restrictionInterval == 2) {
                                        everyDayList.push(e)
                                    }

                                })
                                this.onlylist = onlylist
                                this.everyDayList = everyDayList
                                console.log(onlylist, everyDayList);
                            }


                        }
                    })
            },
            //   邀请而外积分任务
            getqueryMemberExtraInvitedIntegralList() {
                instance.get('queryMemberExtraInvitedIntegralList')
                    .then(res => {
                        console.log(res);
                        if (res.data.rtnCode == 200) {
                            let list = res.data.data
                            this.copyinvitedList = deepCopy(list)
                            list = list.map(e => {
                                return {
                                    enable: e.enable == 1 ? true : false,
                                    id: e.id,
                                    rewardIntegral: e.rewardIntegral,
                                    userCount: e.userCount
                                }
                            })
                            this.invitedIntegralList = list

                        }
                    })
            },
            // 修改 邀请而外积分任务
            handleInvitedUpdate(e) {
                console.log(e);
                if(e.id==''||e.id<0){
                    return
                }
                if(e.rewardIntegral==''||e.rewardIntegral<0){
                    return
                }
                this.isChange = true 
                this.copyinvitedList.forEach( v => {
                     if(v.id == e.id && v.userCount == e.userCount && v.enable == e.enable &&  e.rewardIntegral == v.rewardIntegral){
                        this.isChange = false
                    }
                })
                if(this.isChange){
                   let tempObj = {
                    enable: e.enable == true ? 1 : 0,
                    id: e.id,
                    rewardIntegral: e.rewardIntegral,
                    userCount: e.userCount
                }
                instance.post('updateMemberExtraInvitedIntegralById', tempObj)
                    .then(res => {
                        console.log(res);
                        if (res.data.rtnCode == 200) {
                            this.$message.success('修改成功')
                            this.getqueryMemberExtraInvitedIntegralList()
                        }
                    })
                }

               
            }



        },
    });
</script>

</html>